<%-- 
    Document   : addTeam
    Created on : Jan 11, 2012, 12:01:43 PM
    Author     : User
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib uri="http://struts.apache.org/tags-html"  prefix="html" %> 
<%@taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="/struts-tags" prefix="s" %>

<div id="teamContent">
    <div style="padding:10px;border:1px solid #333">
        <s:form namespace="/team" action="update_%{moduleCode}_%{team.teamId}" id="addTeamForm">
            <s:actionerror/>
            <table>
                <tr>
                    <td width="100" valign="top">Team Id:</td>
                    <td><s:textfield name="team.teamId" size="20" readonly="%{isUpdate}"/> 
                    </td>
                    <td>
                        <s:fielderror><s:param>team.teamId</s:param></s:fielderror>
                    </td>
                </tr> 
                <tr>
                    <td>Description:</td>
                    <td><s:textfield name="team.description" size="20" /></td>
                </tr> 
                <tr>
                    <td>Team Size:</td>
                    <td><s:textfield name="team.size" size="20" /> 
                    </td>
                    <td>
                        <s:fielderror><s:param>team.size</s:param></s:fielderror>
                    </td>
                </tr> 
                <tr>
                    <td colspan="2" align="right">
                        <button id="addTeamButton"><s:if test="isUpdate == true">Modify</s:if><s:else>Add</s:else> Team</button>
                    </td>
                </tr>
            </table>
        </s:form>
    </div>
    <br/>
    <br/>
    <div>
        <table id="teamTable" cellspacing="1" cellpadding="1" class="tablesorter" style="width:500px;" border="1">
            <thead>
                <tr>
                    <th>TeamId</th>
                    <th>Description</th>
                    <th>Size</th>
                    <th>Module Code</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <s:iterator value="teams">
                    <tr>
                        <td><s:property value="teamId"/></td>
                        <td><s:property value="description"/></td>
                        <td><s:property value="size"/></td>
                        <td><s:property value="moduleCode"/></td>
                        <td>

                            <img src="<s:url value="/img/icons/view.png"/>" border="0" alt="View" onclick="call('<s:url namespace="/team" action="edit_%{moduleCode}_%{teamId}" />')" style="cursor:pointer;"/>

                            <img src="<s:url value="/img/icons/delete.png"/>" border="0" alt="delete" onclick="deleteTeam('<s:property value="teamId"/>')" style="cursor:pointer;"/>
                        </td>
                    </tr>
                </s:iterator>
            </tbody>
        </table>
    </div>


</div>

<script type="text/javascript">
    $(function(){
        
        $("#addTeamForm").submit(function(e){
            e.preventDefault();
            dataString = $("#addTeamForm").serialize();

            $.ajax({
                type: "POST",
                url: "<s:url value="/team/update_%{moduleCode}_%{team.teamId}"/>",
                data: dataString,
                success: function(data) {
                    if (data == 'ok')
                        $('#tabs').tabs( "load" ,3);
                    else
                        $('#teamContent').html(data);    
                    
                } 

            }); 
        });    

        $("#addTeamButton").button({icons: {primary:'ui-icon-circle-plus'}});
         
        $("#teamTable").tablesorter({
            headers : {
                4 : {
                    sorter : false
                }
            },
            sortList : [ [ 0, 0 ] ]
        });
        
    });
    
    function deleteTeam(teamId) {
        $.get("<s:url value="/team/delete_%{moduleCode}_"/>"+teamId, function(data) {
            $('#tabs').tabs( "load" ,3);
        });
    
    }
    
    function call(url) {
        $.post(url, function(data) {
            if (data == 'ok')
                $('#tabs').tabs( "load" ,3);
            else
                $('#teamContent').html(data);    
                    
        });        
    }
    
</script>
